import { createWebHistory, createRouter } from 'vue-router';

import Home from '../views/Home.vue';
import Doc from '../views/Doc.vue';
import Switch from '../components/SwitchDemo.vue';
import Button from '../components/ButtonDemo.vue';
import Dialog from '../components/DialogDemo.vue';
import Tabs from '../components/TabsDemo.vue';

import MarkDown from '../components/MarkDown.vue';

import introduce from '../markdown/introduce.md';
import start from '../markdown/start.md';
import install from '../markdown/install.md';
import { h } from 'vue';

const md = string => {
  return h(MarkDown, { content: string, key: string });
};

const history = createWebHistory();
export const router = createRouter({
  history,
  routes: [
    {
      path: '/',
      component: Home
    },
    {
      path: '/doc',
      component: Doc,
      children: [
        {
          path: '',
          redirect: '/doc/introduce'
        },
        {
          path: 'introduce',
          component: md(introduce)
        },
        {
          path: 'start',
          component: md(start)
        },
        {
          path: 'install',
          component: md(install)
        },
        {
          path: 'switch',
          component: Switch
        },
        {
          path: 'button',
          component: Button
        },
        {
          path: 'dialog',
          component: Dialog
        },
        {
          path: 'tabs',
          component: Tabs
        }
      ]
    }
  ]
});
